import { FC, memo } from "react";

import { useSettingStore } from "@/store";
import { IBaseComponentProps } from "@/types/component";

import { SvgIcon } from "../SvgIcon";

import "./index.scss";

export interface IHamburgerProps extends IBaseComponentProps {}

export const Hamburger: FC<IHamburgerProps> = memo(() => {
  const { sidebarOpend, updateSidebarOpend } = useSettingStore();
  return (
    <div
      className="flex-center icon-container"
      onClick={() => {
        updateSidebarOpend();
      }}
    >
      <SvgIcon iconClass="collapse" className={`hamburger ${!sidebarOpend ? "is-active" : ""}`} />
    </div>
  );
});
